<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<html>
<head>
    <title>联系我们 - 教育新闻网</title>
    <link href="${pageContext.request.contextPath}/static/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/bootstrap-icons.css">
    <style>
        .contact-section {
            padding: 60px 0;
            background-color: #fff;
        }
        .contact-card {
            padding: 30px;
            border-radius: 10px;
            background: #fff;
            box-shadow: 0 0 20px rgba(0,0,0,0.05);
            height: 100%;
            transition: transform 0.3s;
        }
        .contact-card:hover {
            transform: translateY(-5px);
        }
        .contact-icon {
            width: 60px;
            height: 60px;
            background: #f8f9fa;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 20px;
        }
        .contact-icon i {
            font-size: 24px;
            color: #0d6efd;
        }
        .map-container {
            height: 400px;
            border-radius: 10px;
            overflow: hidden;
            margin: 40px 0;
        }
        .school-info {
            background: #f8f9fa;
            padding: 40px 0;
            margin: 40px 0;
        }
        .timeline {
            position: relative;
            padding: 20px 0;
        }
        .timeline-item {
            padding: 20px;
            border-left: 2px solid #0d6efd;
            margin-left: 20px;
            position: relative;
        }
        .timeline-item::before {
            content: '';
            width: 12px;
            height: 12px;
            background: #0d6efd;
            border-radius: 50%;
            position: absolute;
            left: -7px;
            top: 24px;
        }
    </style>
</head>
<body>
    <!-- 引入头部 -->
    <jsp:include page="/user/common/header.jsp"/>
    
    <div class="contact-section">
        <div class="container">
            <h2 class="text-center mb-5">联系我们</h2>
            
            <!-- 联系方式卡片 -->
            <div class="row g-4 mb-5">
                <div class="col-md-4">
                    <div class="contact-card">
                        <div class="contact-icon">
                            <i class="bi bi-geo-alt"></i>
                        </div>
                        <h4>地址</h4>
                        <p>中国 北京市海淀区</p>
                        <p>学院路123号</p>
                        <p>邮编：100000</p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="contact-card">
                        <div class="contact-icon">
                            <i class="bi bi-telephone"></i>
                        </div>
                        <h4>电话</h4>
                        <p>招生办：010-12345678</p>
                        <p>教务处：010-12345679</p>
                        <p>学生处：010-12345670</p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="contact-card">
                        <div class="contact-icon">
                            <i class="bi bi-envelope"></i>
                        </div>
                        <h4>电子邮箱</h4>
                        <p>招生咨询：admission@edu.cn</p>
                        <p>学术交流：academic@edu.cn</p>
                        <p>就业指导：career@edu.cn</p>
                    </div>
                </div>
            </div>

            <!-- 学校简介 -->
            <div class="school-info">
                <div class="container">
                    <h3 class="text-center mb-4">学校简介</h3>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="timeline">
                                <div class="timeline-item">
                                    <h5>学校历史</h5>
                                    <p>创建于1950年，是一所具有悠久历史和深厚文化底蕴的高等学府。70多年来，为国家培养了数十万优秀人才。</p>
                                </div>
                                <div class="timeline-item">
                                    <h5>办学理念</h5>
                                    <p>秉承"厚德载物，自强不息"的校训，致力于培养具有创新精神和实践能力的高素质人才。</p>
                                </div>
                                <div class="timeline-item">
                                    <h5>发展愿景</h5>
                                    <p>建设世界一流大学，打造国际化、现代化、综合性的教育科研基地。</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <h5 class="mb-3">师资力量</h5>
                            <p>拥有教职工2000余人，其中：</p>
                            <ul class="list-unstyled">
                                <li><i class="bi bi-check-circle text-primary me-2"></i>院士10余人</li>
                                <li><i class="bi bi-check-circle text-primary me-2"></i>教授200余人</li>
                                <li><i class="bi bi-check-circle text-primary me-2"></i>副教授300余人</li>
                                <li><i class="bi bi-check-circle text-primary me-2"></i>博士生导师150余人</li>
                            </ul>
                            <h5 class="mb-3 mt-4">教学资源</h5>
                            <ul class="list-unstyled">
                                <li><i class="bi bi-book text-primary me-2"></i>图书馆藏书300万册</li>
                                <li><i class="bi bi-laptop text-primary me-2"></i>100个专业实验室</li>
                                <li><i class="bi bi-building text-primary me-2"></i>20个教学楼</li>
                                <li><i class="bi bi-trophy text-primary me-2"></i>50个学生活动中心</li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 交通指南 -->
            <div class="mb-5">
                <h3 class="text-center mb-4">交通指南</h3>
                <div class="row">
                    <div class="col-md-6">
                        <h5><i class="bi bi-train-front me-2"></i>公共交通</h5>
                        <ul class="list-unstyled">
                            <li class="mb-2">地铁：13号线 大学站 A出口步行5分钟</li>
                            <li class="mb-2">公交：123路、456路、789路到大学站</li>
                        </ul>
                        <h5 class="mt-4"><i class="bi bi-car-front me-2"></i>自驾路线</h5>
                        <ul class="list-unstyled">
                            <li class="mb-2">从市中心：沿学院路向北，到大学路口右转</li>
                            <li class="mb-2">从机场：机场高速-四环路-学院路</li>
                        </ul>
                    </div>
                    <div class="col-md-6">
                      
                    </div>
                </div>
            </div>

            <!-- 关注我们 -->
            <div class="text-center">
                <h3 class="mb-4">关注我们</h3>
                <div class="d-flex justify-content-center gap-4">
                    <div class="text-center">
                        <div class="contact-icon mx-auto">
                            <i class="bi bi-wechat"></i>
                        </div>
                        <p>官方微信</p>
                    </div>
                    <div class="text-center">
                        <div class="contact-icon mx-auto">
                            <i class="bi bi-sina-weibo"></i>
                        </div>
                        <p>官方微博</p>
                    </div>
                    <div class="text-center">
                        <div class="contact-icon mx-auto">
                            <i class="bi bi-youtube"></i>
                        </div>
                        <p>官方视频号</p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 引入底部 -->
    <jsp:include page="/user/common/footer.jsp"/>
    
    <script src="${pageContext.request.contextPath}/static/js/bootstrap.bundle.min.js"></script>
</body>
</html> 